<template>
  <div class="cloudlive">
    <setting-closed v-if="status === '0'" @open="status = '1';activeName = '1'"/>
    <el-tabs v-if="status === '1'" v-model="activeName">
      <el-tab-pane label="概览" name="1">
        <about v-if="activeName === '1'"/>
      </el-tab-pane>
      <el-tab-pane label="设置" name="2">
        <setting v-if="activeName === '2'" @close="status = '0'"/>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import Setting from './components/cloudlive/liveOpened';
  import About from './components/cloudlive/about';
  import SettingClosed from './components/cloudlive/liveClosed';
  import {getTenantId} from '@/utils/auth';
  import {addData, getData} from '@/api/cloud/cloud_live_set';

  export default {
    components: {
      Setting,
      SettingClosed,
      About
    },
    data() {
      return {
        activeName: '1',
        status: ''
      }
    },
    created() {
      this.fetchData()
    },
    methods: {
      fetchData() {
        getData(getTenantId()).then(response => {
          if (response.data && response.data.status) {
            this.status = response.data.status
          }
        }).catch(err => {
          console.log(err)
        })
      }
    }
  }
</script>

<style lang="scss">
  .cloudlive {
    padding: 0 20px;
  }
</style>
